<template>
   <view class="">
  <view class="swiper">
  	<u-swiper
	radius="10"
  	        :list="list1"
  			 keyName="url"
  			circular
  	></u-swiper>
  </view>
	
	<view class="list_news">
		<view class="title">
			最新爆料
		</view>
		<view class="box_list">
			<view class="list_every" v-for="item in articleList" :key="item.id" @click="goToDetail(item.id)">
				<view class="title_list" >
					<view class="">
						{{item.bookname || '暂无'}}
					</view>
					<view class="datetime">
						{{ item.author  || '暂无'  }}
					</view>
				</view>
				<view class="new_detail">
					{{item.createtime || '暂无'}}
				</view>
			</view>
		</view>
	</view>
   </view>
</template>

<script>
	import { getArticleList,getBannerList } from '../../api/index.js'
    export default {
        data() {
            return {
                list1: [],
				page:1,
				pageSize:100,
				articleList:[]
            }
        },
		onLoad() {
				this.getList()
				this.getBannerListMessage()
				const arr = [6,8,1,2,5,3,5,2,6,2,0,7,8]
				let a = this.$arrmax.getArrMaxToMin(arr)
				console.log(a);
		},
		methods:{
			getList(){
				getArticleList({
					page: this.page,
					pageSize: this.pageSize,
				}).then(res=>{
						console.log(res);
						if(res.code == 1){
							this.articleList = res.data
						}else{
							this.$uni.gettitle(res.msg)
						}
				})
			},
			getBannerListMessage(){
				this.list1=[]
				getBannerList().then(res=>{
					console.log(res);
					if(res.code == 1){
						res.data.forEach((item,index)=>{
							this.list1.push({url:item.bannerImage})
						})
					}
				})
			},
			goToDetail(item){
				uni.navigateTo({
					url:'/pages/news_detail/news_detail?id='+item 
					
				})
			}
		}
    }
</script>


<style lang="scss">
	page{
		background-color: #f3f3f3;
		.u-swiper__wrapper {
			padding:0 25rpx;
			box-sizing: content-box;
			border-radius: 80rpx;
			overflow: hidden;
			height: 400rpx !important;
			image{
				height: 100% !important;
				border-radius: 80rpx !important;
			}
		}
		.swiper{
			margin-top: 20rpx;
			border-radius: 20rpx;
			overflow: hidden;
		}
		.list_news{
			margin-top: 50rpx;
			padding: 20rpx 25rpx;
			box-sizing: content-box;
			background-color: #fff;
			width: 700rpx;
			.title{
				font-size: 36rpx;
				font-weight: 600;
				margin-bottom: 20rpx;
			}
			.box_list{
				.list_every{
					height: 260rpx;
					width: 700rpx;
					border:1rpx solid #c7e6ff;
					border-radius: 20rpx;
					margin-bottom: 30rpx;
					padding: 20rpx;
					box-sizing: border-box;
					.title_list{
						margin-bottom: 30rpx;
						font-size: 30rpx;
						font-weight: 500;
						font-style:italic;
						display: flex;
						justify-content: space-between;
						.datetime{
							font-size: 28rpx;
						}
					}
					.new_detail{
						    overflow : hidden;
						    text-overflow: ellipsis;
						    display: -webkit-box;
						    -webkit-line-clamp: 3;
						    -webkit-box-orient: vertical;
					}
				}
			}
		}
	}
</style>